<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/layout' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>{{level1}}</el-breadcrumb-item>
      <el-breadcrumb-item>{{level2}}</el-breadcrumb-item>
      <!-- {{myvalue}} -->
    </el-breadcrumb>
    <!-- <button @click="sendValueToParent2">传值给父组件</button> -->
  </div>
</template>

<script>
export default {
  // props中接收的值，可以是任何类型
  // props:['level1','level2']
  props:{ // 这种写法更加精细化
    level1:String,
    level2:String,
    callback:Function
  },
  data(){
    return {
      myvalue:'我是一个好人'
    }
  },
  methods:{
    sendValueToParent(){ //{name:'小明',age:20}
      /**
       * 参数1：自定义事件名称
       * 参数2：需要传递的参数，可以是任意类型，比如字符串、数字、数组...
       */
      // this.$emit('myevent',{name:'小明',age:20})
      this.$emit('myevent')
    },
    sendValueToParent2(){
      // console.log(this.callback)
      this.callback({name:'小明',age:20})
    }
  }
}
</script>

<style scoped>
.el-breadcrumb {
  background-color: #d3dce6;
  height: 50px;
  line-height: 50px;
  padding-left: 10px;
}
</style>

